import React, { PureComponent } from 'react';
import { connect } from 'react-redux';
import { withRouter } from 'react-router-dom';
import { Pagination } from 'antd';
import './style.scss';
class CustomPagination extends PureComponent {
    constructor(props) {
        super(props);
        this.state = {
        }
    }
    render() {
        const {onChange , total , pageSize , current} = this.props;
        return (
            <div className="by-xiong-pagination" ref={PageObj => this.PageObj = PageObj}>
                <Pagination total={total} current={current} pageSize={pageSize || 10} itemRender={this.itemRender.bind(this)} onChange={onChange}/>
            </div>
        )
    }
    // 自定义分页器上下按钮文字
    itemRender(current, type, originalElement) {
        if (type === 'prev') {
            return <a href="javascript:void(0)" className="switch-btn" onClick={e=>e.preventDefault()}>上一页</a>;
        } if (type === 'next') {
            return <a href="javascript:void(0)" className="switch-btn" onClick={e=>e.preventDefault()}>下一页</a>;
        }
        return originalElement;
    }
    componentDidMount (){
        // 去掉页码按钮的title
        let lis = this.PageObj.getElementsByTagName('li');
        for (let i = 0; i < lis.length;i++) {
            lis[i].setAttribute('title','');
        };
        // let ellipsis = document.getElementsByClassName('ant-pagination-item-ellipsis');
        // console.log(ellipsis)
       
        // setTimeout(() => {
        //     ellipsis.innerText = 'ellipsis';
        // }, 300);
    }
}

const mapState = (state) => ({

});

const mapDispatch = (dispatch) => ({

});


export default connect(mapState, mapDispatch)(withRouter(CustomPagination));